<template>
  <div>
    <button type="button" @click="mYtoggleDark">sss</button>
    <div>
      <p v-if="isDark">当前是暗黑模式</p>
      <p v-else>当前是亮色模式</p>
    </div>
  </div>
</template>
<script setup lang="ts">
import { useDark, useTitle } from '@vueuse/core'
import { computed } from 'vue'

const isDark = useDark()
const title = computed(() => (isDark.value ? '🌙 Good evening!' : '☀️ Good morning!'))

useTitle(title)

const mYtoggleDark = () => {
  isDark.value = !isDark.value
}
</script>